/*
 * @Author: jk 
 * @Date: 2020-12-01 13:31:22 
 * @Last Modified by: jk
 * @Last Modified time: 2021-01-29 15:20:46
 */

.main {
  // margin-top: 0.5rem;
  background-color: #fff;
  // max-width: 1200px;

  .left {
    margin-top: 1rem;
    padding: 0.3rem;
    // border-radius: 0.3rem;
    // border-bottom: 1px solid #eee;
    // box-shadow: 0 4px 8px 0 rgba(28,31,33,.08);
    .listWrap {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin: 40px 0;
      transition: all 0.3s;

      // align-items: center;
      &:hover {
        transform: translateY(-15px);
      }
      .infoWrap {
        flex: 1;
        margin-left: 1rem;
      
        .tagWrap {
          // font-size: 14px;
          margin-top: 10px;
          :global(.ant-tag) {
            font-size: 13px;
          }
        }
        .title {
          margin: 10px 0;
          font-size: 24px;
          font-weight: 600;
          letter-spacing: 2px;
        }
        .title:hover {
          cursor: pointer;
        }
        .date {
          font-size: 12px;
          text-transform: uppercase;
          font-weight: 500;
          opacity: 0.8;
        }
      }
      .img {
        width: 200px;
        height: 160px;
        border-radius: 32px;
        box-shadow: 2px 4px 25px rgba(0, 0, 0, 0.15);
        object-fit: cover;
      }
                
      @media screen and (max-width: 500px) {
        .img {
          width: 80px;
          height: 80px;
        }
      }
      
    }
  }

  .right {
    background-color: #fff;
    // margin-left: 0.5rem;
    padding: 0.3rem;
    border-radius: 0.3rem;
    // border-bottom: 1px solid #eee;
  }
}

